<template>
  <div>
    <SearchContainer @search="getData" @reset="() => formRef.resetFields()">
      <a-form ref="formRef" class="form-style-flex" :model="formState">
        <a-form-item name="mcbh">
          <a-input v-model:value="formState.mcbh" class="w-64" placeholder="物品编号/物品名称/助记码" />
        </a-form-item>
      </a-form>
    </SearchContainer>
    <a-card class="mt-2">
      <div class="flex justify-end">
        <BaseExport type="运维" class="mb-3" name="物品字典" code="000180" :search-params="formState">导出</BaseExport>
      </div>
      <BaseTable fill :data-source="tableData" :loading="loading" :extra-height="20" column-code="000180" :pagination="pagination">
        <template #bodyCell="{ column, index, record }">
          <template v-if="column.dataIndex === 'xh'">
            {{ index + 1 }}
          </template>
          <template v-if="column.dataIndex == 'yxzt'">
            <a-switch v-model:checked="record.yxzt" checked-value="0" un-checked-value="1" @change="onHandleDeactivate(record, $event)" />
          </template>
          <template v-if="column.dataIndex === 'xmlb'">
            <p v-if="record.xmlb === 30">卫生材料</p>
            <p v-else-if="record.xmlb === 31">易耗品</p>
            <p v-else-if="record.xmlb === 32">固定资产</p>
            <p v-else>-</p>
          </template>
          <!-- <template v-if="column.dataIndex === 'action'">
            <a-space>
              <a-button v-if="record.yxzt" type="link" size="small" @click="onClickStatus(record.bh, 0)"> 启用 </a-button>
              <ConfirmModal v-else description="确定停用?" @confirm="onClickStatus(record.bh, 1)">
                <a-button type="text" danger size="small"> 停用 </a-button>
              </ConfirmModal>
            </a-space>
          </template> -->
        </template>
      </BaseTable>
    </a-card>
  </div>
</template>

<script setup>
import { ref } from 'vue'
import { message } from 'ant-design-vue'
import { post } from '@/utils/request'

const formRef = ref(null)
const formState = ref({
  mcbh: ''
})

const { loading, tableData, getData, pagination } = useTable({
  url: 'operation/opex/getItemDictionaryList',
  pagination: true,
  immediate: true,
  params: formState.value,
  onSuccess: () => {
    tableData.value = tableData.value.map((item) => {
      item.yxzt = item.yxzt ? '1' : '0'
      return item
    })
  }
})

const onHandleDeactivate = async (row, number) => {
  const { code, msg } = await post('operation/opex/doModifyDrugStatus', { bh: row.bh, yxzt: number })
  if (code !== 0) return message.error(msg || '操作失败')
  getData()
  message.success(msg || '操作成功')
}
</script>
